<%--
  Created by IntelliJ IDEA.
  User: Tung An
  Date: 12/14/13
  Time: 3:54 PM
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <link href='http://fonts.googleapis.com/css?family=PT+Sans:400,700' rel='stylesheet' type='text/css'>
    <link rel="stylesheet" type="text/css" href="css/core.css">
    <link rel="stylesheet" type="text/css" href="css/popup.css">
    <link rel="stylesheet" type="text/css" href="css/main_page.css">
    <link rel="stylesheet" type="text/css" href="css/create_page.css">
    <link rel="stylesheet" type="text/css" href="css/detail_page.css">
    <link rel="stylesheet" type="text/css" href="css/header.css">
    <link rel="stylesheet" type="text/css" href="css/login_popup.css">

    <script type="text/javascript" src="js/utils.js"></script>
    <script type="text/javascript" src="js/core.js"></script>
    <script type="text/javascript" src="js/header.js"></script>
    <script type="text/javascript" src="js/main_page.js"></script>
    <script type="text/javascript" src="js/login_popup.js"></script>
    <script type="text/javascript" src="js/look_detail.js"></script>
    <title>Look Detail - Fashion Zone</title>
</head>
<body>
<jsp:include page="header.jsp"/>
<div id="popup" class="popup hidden" data="popup">
    <jsp:include page="popup/login.jsp"/>
</div>
<jsp:include page="popup/popup.jsp"/>
<div id="look-detail" class="wrapper box create">
    <div class="look-caption page-title" name="lookName"></div>
    <div class="empty-line"></div>
    <div class="panel left">
        <div id="image-container" data="img">
            <div class="look-caption"></div>
            <div id="image-look">
                <img name="lookImage"/>
            </div>
            <div id="tag-container" class="tag-container"></div>
        </div>
        <div class="tag-detail-container">
            <ul id="tag-detail-list" class="tag-detail-list">
            </ul>
        </div>
    </div>
    <div class="panel right">
        <div class="user-info">
            <div class="inline avatar">
                <img name="avatarURL" src="images/default_avatar.png"/>
            </div>
            <div class="inline info">
                <div class="top">
                    <span class="user-name" name="username"></span>
                    <span>has posted</span>
                    <span name="updateTime"></span>
                </div>
                <div class="address">Ho Chi Minh City</div>
            </div>
        </div>
        <div class="description" name="lookDescription"></div>
        <div class="comment-container">
            <ul id="comment-list" class="comment-list"></ul>
            <div class="new-comment">
                <div class="inline avatar">
                    <img src="images/default_avatar.png"/>
                </div>
                <input id="new-comment" type="text" placeholder="Write your comment..."/>
            </div>
        </div>
    </div>

    <div class="hidden">
        <div id="tag-node" class="tag tag-node " data="tagNode">1</div>
        <li class="comment-item" data="comment-item" id="comment-item-template">
            <div class="inline avatar"><img name="avatarURL" src="images/default_avatar.png"></div>
            <div class="inline comment">
                <div class="info">
                    <span name="username" class="user-name">Unknown</span><span>has posted</span><span name="updateTime" class="update-time">moments ago</span><div data="edit" class="edit">
                    Edit
                </div>
                    <div data="delete" class="delete">
                        Delete
                    </div>
                </div>
                <div name="content" class="content"></div>
            </div>
        </li>
    </div>
</div>
</body>
</html>